<template>
  <div class="import-box">
    <el-card>
      <h3>员工导入</h3>
      <UploadExcel :before-upload="beforeUpload" :on-success="onSuccess" />
    </el-card>
  </div>
</template>

<script>
import { sysUserBatch } from '@/api/employees'
import UploadExcel from '@/components/UploadExcel/index'
export default {
  components: {
    UploadExcel
  },
  methods: {
    beforeUpload(file) {
      // 读取文件对象 true正常读取，false：中止读取
      const limit1k = file.size / 1024 < 10000
      if (!limit1k) {
        this.$message.error('小于1k')
      }
      return limit1k
    },
    // 处理excel事件
    changeExcelTime(num) {
      const t = new Date((num - 1) * 24 * 60 * 60 * 1000 - 8 * 60 * 60 * 1000)
      t.setYear(t.getFullYear() - 70)
      return t
    },
    async onSuccess(obj) {
      // 读取excel文件成功后的回调函数
      console.log(obj)
      const rules = {
        入职日期: 'timeOfEntry',
        姓名: 'username',
        工号: 'workNumber',
        手机号: 'mobile',
        转正日期: 'correctionTime'
      }
      // 循环遍历生成一个新数组
      // 通过map循环数据，通过obj.keys转换内部对象为循环内部对象
      // 通过生成一个新对象retuen出去
      const newArr = obj.results.map((item) => {
        const obj = {}
        Object.keys(item).forEach((key) => {
          obj[rules[key]] = item[key]
        })
        return obj
      })
      newArr.forEach((item) => {
        Object.keys(item).forEach((key) => {
          if (key === 'correctionTime' || key === 'timeOfEntry') {
            item[key] = this.changeExcelTime(item[key])
          }
        })
      })
      console.log(newArr)
      // newArr.forEach((item) => {
      //   // 遍历数组的每一个元素，拿到每一个元素中的key
      //   Object.keys(item).forEach((key) => {
      //     // 遍历元素中的每一个key
      //     // 判断key是不是入职或转正时间
      //     if (key === 'timeOfEntry' || key === 'correctionTime') {
      //       // 是就调用事件转换函数
      //       item[key] = this.changeExcelTime(item[key])
      //     }
      //   })
      // })
      // 接口请求
      const res = await sysUserBatch(newArr)
      // 提示导入成功
      this.$message(res.message)
      // 跳转回员工页
      this.$router.push('/employees')
    }
  }
}
</script>

<style lang="scss" scoped>
.import-box {
  .el-card {
    padding: 15px;
  }
  text-align: center;
}
</style>
